<template>
  <div>
    <div class="top_parent">
      <img src="../../assets/image/show/show_banner.png" style="width:100%" alt />
      <div class="bread">
        <p>Home》exhibition</p>
      </div>
    </div>
    <div class="center">
      <ul>
        <li v-for="(item,index) of list" :key="index">
          <div class="changxian">
            <p class="num">
              <span>No.{{item.num}}</span>
              <img src="../../assets/image/enexhibition/xian.png" alt />
            </p>
            <p class="title">{{item.title}}</p>
          </div>
          <div class="ziti">
            <p>{{item.content1}}</p>
            <p>{{item.content2}}</p>
          </div>
          <div class="pic">
            <img :src="item.img1" alt />
            <img :src="item.img2" alt />
            <img :src="item.img3" alt />
          </div>
        </li>
      </ul>
    </div>

    <enfoot2 class="dibu"></enfoot2>
  </div>
</template>
<script>
import enfoot2 from "./enfoot2";
export default {
  data() {
    return {
      list: [
        {
          num: 1,
          title: "Exhibition Area   Beautiful Homelands",
          content1: "Display of Zhoushan Natural Resources.",
          content2:
            "This exhibition area is focus on the foison natural resource and beautiful environment of Zhoushan. After having experienced endless and twisting evolutions, Zhoushan Islands are endowed with a myriad of flora and fauna. Magic and splendid organism not only provide human existence with necessary conditions, but also bring beauty to our life. Sea waves, sandy beaches ,grotesque rocks, flying birds, insects, creature, fishes, grass, flowers and trees constitute the environment we are living in, and they impact our life deeply. The homeland has nurtured us, but we never claim without any restrains; we should protect it, including the sea surrounding us--which is the beautiful homeland for us and  for our future generations.",
          img1: require("../../assets/image/enexhibition/1.png"),
          img2: require("../../assets/image/enexhibition/2.png"),
          img3: require("../../assets/image/enexhibition/3.png"),
        },
        {
          num: 2,
          title: " Exhibition Area  Fishing Custom & Sea Charm",
          content1: " Display of Zhoushan Marine Culture.",
          content2:
            "Islanders became attached to the sea the moment they were born so that they began to chrish their adoration and awesomeness for the sea. Under the temper of existence and production and in the process of the harmonious coexistence with the Nature, they created their unique marine culture. Fishing is the main economy and life style of Zhoushanese from time immemorial, to which the fishing gear, acquatic products processing and shipbuilding technology are related therewith developed and take the lead in China. The people in Zhoushan have composed one after another wonderful songs of fishing with their industriousness and sweat.",
          img1: require("../../assets/image/enexhibition/4.png"),
          img2: require("../../assets/image/enexhibition/5.png"),
          img3: require("../../assets/image/enexhibition/6.png"),
        },
        {
          num: 3,
          title: "Exhibition Area  Past Events of the Islands",
          content1: " Display of Zhoushan History",
          content2:
            "Situated at a strategic position at the mouth of the Yangtze River, Zhoushan has long been a place for navy assembling since ancient times and experiences many wars. As a result Zhoushan has also been enjoying a profound and brilliant civilization for thousands of years. In this exhibition area, we will get to know Zhoushan of its past and experience its vicissitudes with the passage of time.",
          img1: require("../../assets/image/enexhibition/7.png"),
          img2: require("../../assets/image/enexhibition/8.png"),
          img3: require("../../assets/image/enexhibition/9.png"),
        },
      ],
    };
  },
  components: {
    enfoot2: enfoot2,
  },
};
</script>
<style scoped>
p,
ul {
  padding: 0px;
  margin: 0px;
}
.top_parent {
  position: relative;
}
.top_parent .bread {
  max-width: 1200px;
  margin: auto;
}
.top_parent p {
  position: absolute;
  bottom: 20px;
  color: #6e6e6e;
}
a {
  text-decoration: none;
  color: #6e6e6e;
}
.center {
  margin: auto;
  margin-top: 70px;
  max-width: 1200px;
}
.changxian {
  background: url("../../assets/image/enexhibition/changxian.png") no-repeat
    center;

  position: relative;
  margin-bottom: 44px;
  font-size: 24px;
  color: #333333;
  display: flex;
  justify-content: center;
  align-items: center;
}
.num {
  position: absolute;
  top: -27px;
  left: 350px;
}
.num span {
  position: absolute;
  top: 0px;
  left: -35px;
}
.num img {
  position: absolute;
  top: 0px;
  left: 0px;
}
.ziti {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 16px;
  color: #333333;
  line-height: 2;
}
.ziti,
.pic {
  max-width: 1100px;

  margin: auto;
  margin-bottom: 60px;
}
.pic {
  display: flex;
  justify-content: space-between;
  margin-top: 30px;
}
.title {
  margin-left: 70px;
  font-family: Arial, Helvetica, sans-serif;
}
li {
  list-style: none;
}
</style>